<template>
  <el-dialog
    title="真人验证"
    :visible.sync="dialogVisible"
    width="600px"
    :show-close="false"
    :close-on-click-modal="false"
    :close-on-press-escape="false"
    :lock-scroll="false"
  >
    <img :src="capchaUrl" alt />
    <el-input v-model="anwser" placeholder="请输入答案"></el-input>
    <span slot="footer" class="dialog-footer">
      <el-button type="primary" @click="submit">确 定</el-button>
    </span>
  </el-dialog>
</template>
<script>
export default {
  name: 'InteractVerify',
  data() {
    //const rootPath = process.env.NODE_ENV === 'development' ? '/api' : 'http://115.29.226.80:8099/xxpt/web/'
    //const rootPath = process.env.NODE_ENV === 'development' ? '/api' : 'http://112.124.28.76:8099/xxpt/web/'
    //const rootPath = process.env.NODE_ENV === 'development' ? '/api' : 'http://192.168.102.248:8099/xxpt/web/'
    const rootPath = process.env.NODE_ENV === 'development' ? '/api' : 'http://25.20.199.49:8099/xxpt/web/'
    return {
      dialogVisible: false,
      anwser: '',
      content: '',
      capchaUrl: rootPath + '/captcha/captchaImage'
    }
  },
  methods: {
    getVerify() {
      this.capchaUrl = this.capchaUrl + '?query=' + new Date().getTime()
      this.dialogVisible = true
      // 暂停视频
      this.$emit('fail')
    },
    submit() {
      utils.post('/captcha/valid', {
        code: +this.anwser
      }, res => {
        if (process.env.NODE_ENV !== 'production') {
          console.log('captcha valid response:', res)
        }
        if (res.success) {
          this.dialogVisible = false
          this.capchaUrl = this.capchaUrl + '?query=' + new Date().getTime()
          this.anwser = ''
          this.$emit('success')
        } else {
          this.$emit('fail')
        }
      })
    }
  }
}
</script>
